// 组件
import uiContainerFull from './components/ui-container-full.vue';

export default {
  name: 'ui-container',
  computed: {
    // 始终返回渲染组件，判断是否使用滚动优化
    component() {
      return uiContainerFull;
    },
  },
  render(h) {
    const slots = [h('div', this.$slots.default)];
    if (this.$slots.header) slots.push(h('div', { slot: 'header' }, [this.$slots.header]));
    if (this.$slots.positionInfo) slots.push(h('div', { slot: 'positionInfo' }, [this.$slots.positionInfo]));
    if (this.$slots.footer) slots.push(h('div', { slot: 'footer' }, [this.$slots.footer]));
    return h(
      'div',
      {
        ref: 'container',
        class: 'container-component',
      },
      [
        h(
          this.component,
          {
            ref: 'component',
            props: this.$attrs,
            on: {
              scroll: (e) => this.$emit('scroll', e),
            },
          },
          slots,
        ),
      ],
    );
  },
  methods: {
    // 返回顶部
    scrollToTop() {
      this.$refs.component.scrollToTop();
      // 如果开启了 better scroll 还需要手动触发一遍 scroll 事件
      const bs = this.$refs.component.BS;
      if (bs) this.$refs.component.scroll();
    },
    // 用法同原生方法 scrollBy
    scrollBy(x = 0, y = 0) {
      this.$refs.component.$refs.body.scrollBy(x, y);
    },
    // 用法同原生方法 scrollTo
    scrollTo(x = 0, y = 0) {
      this.$refs.component.$refs.body.scrollTo(x, y);
    },
    // 用法同原生方法 scrollTop
    scrollTop(top = 0) {
      this.$refs.component.$refs.body.scrollTop = top;
    },
  },
};
